/*
 * This Source Code Form is subject to the terms of the Mozilla Public
 * License, v. 2.0. If a copy of the MPL was not distributed with this
 * file, You can obtain one at http://mozilla.org/MPL/2.0/.
 */

/*
 * Copyright (c) 2014, Joyent, Inc.
 */

#page-users {
  .users-search {
    .widget-content;
  }
  .groups-container {
    display: inline-block;
  }
  .groups {
    display: inline-block;
    vertical-align: bottom;
    margin-left: 10px;
    .group {
      font-size: 8px;
      padding: 2px 5px;
      padding-top: 3px;
      margin-bottom: 2px;
      text-transform: uppercase;
      font-weight: 400;
      letter-spacing: 1px;
      background: #333;
      color: #fff;
    }
    .group.readers {
      background: #888;
    }
    .group.operators {
      background: @brand-danger;
    }
  }



  .user-icon {
    width: 48px;
    height: 48px;
    background-color: #FFF;
    background-position: 50% 50%;
    background-repeat: no-repeat;

    border-radius: 50%;
    vertical-align: top;
    margin-left: 20px;
    display: inline-block;
  }


  .users-list {
    .zero-state {
      text-align: center;
      display: block;
    }
  }

  .users-list-item {
    .widget-content;
    margin-bottom: 10px;
    overflow: hidden;
    .status {
      float: left;
      width: 15px;
      margin-right: 10px;
      height: 80px;
      &.running { background: @state-success-bg; }
      &.unavailable { background: @state-danger-bg;}
      &.unknown { background: @state-danger-bg;}
    }
    .subuser {
      font-size: 10px;
      color: @gray-light;
    }
    .account {
      font-size: 8px;
      font-family: @font-family-monospace;
    }


    a { cursor: pointer; }
    a:hover { text-decoration: underline; }
    .login {
      font-size: 18px;
      display: inline;
    }
   .name {
     font-size: 12px; line-height: 20px;
     color: #aaa;
   }

    .cn { padding-right: 2px; color: #444; }
    .company { padding-left: 2px; color: #444; }
    .email { font-size: 12px; line-height: 20px; }
    .uuid {
      font-size: 8px;
      line-height: 20px;
      font-style: italic;
      display: block;
      font-family: @font-family-monospace;
      color: @gray-light;
    }

    .provisioning { text-transform: uppercase; font-size: 12px; color: #aaa; }
    .provisioning strong { text-transform: uppercase; }
    .provisioning strong.enabled { color: @state-success-text; }
    .provisioning strong.disabled { color: @state-danger-text; }

  }

  .caption { padding: 0; margin-top: -10px; }
  .more {
    width: 100%;
    display: block;
    text-align: center;
    background: @state-info-bg;
    padding: 10px;
    .box-sizing(border-box);
  }
  .counters { padding: 10px;}


}

